<template>
	<view class="container">
		<view class="list" v-for="(item,index) in positionInfoList" :key="item.id">
			<view class="title">
				<u-icon size="20" color="#398ade" name="tags-fill"></u-icon>
				<text>{{$t('homepage.AccessoryManagement.warehousePositionInstorage')}}</text>
			</view>
			<view class="content">
				<view class="text">
					<text class="sub">{{$t('public.partCode')}}</text>
					<view class="subContent">{{item.code}}</view>
				</view>
				<view class="text">
					<text class="sub">{{$t('homepage.AccessoryManagement.partStock')}}</text>
					<view class="subContent">{{item.stock}}{{$t('public.piece')}}</view>
				</view>
				<view class="text">
					<text class="sub">{{$t('public.createTime')}}</text>
					<view class="subContent">{{item.createTime}}</view>
				</view>
			</view>
			<view class="btn">
				<u-button type="success" :text="$t('public.submit')"
					customStyle="width:50%;height:35px;border-top-left-radius:50px;border-bottom-left-radius:50px;"
					@click="warehouseSubmit(item)">
				</u-button>
				<u-button type="primary" :text="$t('homepage.AccessoryManagement.transfer')"
					customStyle="width:50%;height:35px;border-top-right-radius:50px;border-bottom-right-radius:50px;"
					@click="transferReceipt(item)">
				</u-button>
			</view>
		</view>
		<!-- 仓位入库提交 -->
		<u-modal :show="submitShow"
			:title="$t('homepage.AccessoryManagement.warehousePositionInstorageSubmit')" :content='$t('
			public.isSure')+$t('homepage.AccessoryManagement.warehousePositionInstorageSubmit')+$t('public.question')'
			showCancelButton @confirm="submitConfirm" @cancel="submitCancel">
		</u-modal>
		<!-- 储位入库库存确认 -->
		<u-modal :show="receiptShow" :title="$t('homepage.AccessoryManagement.storageInstorageStock')" showCancelButton
			@confirm="receiptConfirm" @cancel="receiptCancel">
			<u--input :placeholder="$t('homepage.AccessoryManagement.pleaseSureStockNum')" border="surround"
				v-model="num"></u--input>
		</u-modal>
	</view>
</template>

<script>
	import {
		saveWarehousePosition,
		allocation
	} from "@/api/homepage.js"
	export default {
		data() {
			return {
				submitShow: false,
				receiptShow: false,
				num: '',
				accessoryDataId: '',
				warehousePositionId: '',
				warehouseStorageId: '',
				targetPositionId: '',
				targetStorageId: '',
			}
		},
		props: {
			positionInfoList: {
				type: Array,
				default: []
			}
		},
		methods: {
			warehouseSubmit(item) {
				this.submitShow = true
				this.warehousePositionId = item.warehousePositionId,
					this.warehouseStorageId = item.warehouseStorageId
			},
			submitCancel() {
				this.submitShow = false
			},
			submitConfirm() {
				this.accessoryDataId = this.$store.state.accessoryDataId
				saveWarehousePosition({
					warehouseInId: this.accessoryDataId,
					warehousePositionId: this.warehousePositionId,
					warehouseStorageId: this.warehouseStorageId
				}).then((res) => {
					uni.$u.toast(res.message)
					this.submitShow = false
				}).catch((res) => {
					uni.$u.toast(res.message)
				});
			},
			transferReceipt(item) {
				this.receiptShow = true
				this.num = item.stock
				this.targetPositionId = item.warehousePositionId
				this.targetStorageId = item.warehouseStorageId
			},
			receiptCancel() {
				this.receiptShow = false
			},
			receiptConfirm() {
				this.accessoryDataId = this.$store.state.accessoryDataId
				allocation({
					warehouseInId: this.accessoryDataId,
					allocationNum: this.num,
					targetPositionId: this.targetPositionId,
					targetStorageId: this.targetStorageId,
				}).then((res) => {
					this.receiptShow = false
					uni.$u.toast(res.message)
				}).catch((res) => {
					uni.$u.toast(res.message)
				});
			},
		}
	};
</script>

<style lang="scss" scoped>
	.container {
		// padding-top: 60px;
		// margin-bottom: 50px;
	}

	.list {
		width: 89vw;
		height: 160px;
		margin: 5px 10px;
		padding: 10px;
		background-color: #Fff;
		border-radius: 8px;
	}

	.title {
		padding-bottom: 5px;
		display: flex;
		font-size: 14px;
		font-weight: 800;
		border-bottom: 1px dashed #eaebee;
	}

	.text {
		color: #ccc;
		padding: 6px 3px;
		font-size: 14px;
		display: flex;
	}

	.sub {
		text-align: left;
	}

	.subContent {
		width: 68vw;
		text-align: right;
	}

	.btn {
		display: flex;
		width: 50%;
		margin: 0 auto;
	}
</style>